```vue
<script setup>
import { ref } from 'vue'
import * as XLSX from 'xlsx'

const $emit = defineEmits([''])
const props = defineProps({
     btnText: {
          type: String,
          default: '导入台账',
     },
})

// 读取文件为二进制字符串
function readFile(file) {
     return new Promise((resolve) => {
          const reader = new FileReader()
          reader.readAsBinaryString(file)
          reader.onload = (ev) => {
               const data = ev.target.result
               const wb = XLSX.read(data, { type: 'binary' })
               console.log(wb, '---->解析后的数据')

               const result = []
               wb.SheetNames.forEach((sheetName) => {
                    const sheet = wb.Sheets[sheetName]
                    const sheetJson = XLSX.utils.sheet_to_json(sheet, {
                         offset: 0,
                         defval: '',
                    })
                    result.push({
                         sheetName,
                         sheet: sheetJson,
                    })
               })
               resolve(ev.target.result)
          }
     })
}

// 将文件转换为XLSX格式
const file2XLSX = (file) => {
     return new Promise((resolve, reject) => {
          const reader = new FileReader()
          reader.readAsBinaryString(file)
          reader.onload = (e) => {
               console.log(e, '读取文件成功的e')
               const data = e.target.result
               const wb = XLSX.read(data, { type: 'binary' })
               console.log(wb, '---->解析后的数据')

               const result = []
               wb.SheetNames.forEach((sheetName) => {
                    const sheet = wb.Sheets[sheetName]
                    const sheetJson = XLSX.utils.sheet_to_json(sheet, {
                         offset: 1,
                         defval: '',
                    })
                    result.push({
                         sheetName,
                         sheet: sheetJson,
                    })
               })
               resolve(result)
          }
          reader.onerror = (error) => reject(error)
     })
}

const title = ref([]) // 表头
const tableData = ref([]) // 数据列表

// 选择文件的方法
const handle = async (ev) => {
     title.value = []
     tableData.value = []
     const file = ev.raw

     console.log('file', file)
     const data = await file2XLSX(file)
     const worksheet = data[0].sheet

     console.log('data', worksheet)

     // 获取表头
     for (const key in worksheet[0]) {
          title.value.push(key)
     }
     console.log('title', title.value)

     // 转换数据格式
     worksheet.forEach((item) => {
          const obj = {}
          title.value.forEach((item2) => {
               obj[item2] = item[item2]
          })
          tableData.value.push(obj)
     })

     console.log('tableData.value', tableData.value)
     const obj = {
          title: title.value,
          tableData: tableData.value,
     }
     $emit('getTableData', obj)
}
</script>

<template>
     <div>
          <el-upload action accept=".xlsx,.xls" :show-file-list="false" :auto-upload="false" :on-change="handle">
               <template #trigger>
                    <el-button type="primary">{{ btnText }}</el-button>
               </template>
          </el-upload>
     </div>
</template>

<style scoped lang="scss"></style>
